--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Commit 7194ffc6d4571b72703e2a16a01e28a05343a3c8
Parents : 8aaa770
Author : Ivan <ivan@quad4.io>
Signature : Signature validation error
Date : 2026-04-12T19:12:35-05:00
refactor(components): format
Changes
6 files changed, 107 insertions(+), 56 deletions(-)
Diff
diff --git a/meshchatx/src/frontend/components/map/MapPage.vue b/meshchatx/src/frontend/components/map/MapPage.vue
index 4f3aa2d9..103e9f69 100644
--- a/meshchatx/src/frontend/components/map/MapPage.vue
+++ b/meshchatx/src/frontend/components/map/MapPage.vue
@@ -15,9 +15,7 @@
class="flex flex-wrap items-center gap-x-1.5 gap-y-2 sm:ml-auto sm:flex-nowrap sm:gap-2 sm:justify-end min-w-0"
>
<!-- offline/online toggle -->
- <div
- class="flex items-center bg-gray-100 dark:bg-zinc-800 rounded-lg p-0.5 sm:p-1 min-w-0 max-w-full"
- >
+ <div class="flex items-center bg-gray-100 dark:bg-zinc-800 rounded-lg p-0.5 sm:p-1 min-w-0 max-w-full">
<button
class="p-1.5 sm:p-2 rounded-lg text-gray-500 hover:bg-gray-200 dark:hover:bg-zinc-700 transition-colors shrink-0"
title="Map Discovered Interfaces"
diff --git a/meshchatx/src/frontend/components/tools/BotsPage.vue b/meshchatx/src/frontend/components/tools/BotsPage.vue
index 76ac5628..9636d060 100644
--- a/meshchatx/src/frontend/components/tools/BotsPage.vue
+++ b/meshchatx/src/frontend/components/tools/BotsPage.vue
@@ -44,7 +44,10 @@
class="rounded-lg border border-dashed border-gray-300 dark:border-zinc-700 bg-gray-50/50 dark:bg-zinc-900/50 p-4 flex flex-col items-center justify-center min-h-[140px] opacity-70"
>
<div class="p-2 bg-gray-100 dark:bg-zinc-800 rounded-lg mb-2">
- <MaterialDesignIcon icon-name="plus" class="size-6 text-gray-400 dark:text-gray-500" />
+ <MaterialDesignIcon
+ icon-name="plus"
+ class="size-6 text-gray-400 dark:text-gray-500"
+ />
</div>
<div class="text-sm font-medium text-gray-500 dark:text-gray-400 text-center">
{{ $t("bots.more_bots_coming") }}
@@ -75,7 +78,9 @@
/>
</div>
<div class="min-w-0">
- <div class="font-bold text-gray-900 dark:text-white truncate">{{ bot.name }}</div>
+ <div class="font-bold text-gray-900 dark:text-white truncate">
+ {{ bot.name }}
+ </div>
<div class="text-xs font-mono text-gray-500 break-all">
{{ bot.address || runningMap[bot.id]?.address || "Not running" }}
</div>
@@ -87,42 +92,44 @@
</div>
</div>
</div>
- <div class="flex flex-wrap items-center gap-1.5 sm:gap-2 justify-end sm:shrink-0 pt-1 sm:pt-0 border-t border-gray-100 dark:border-zinc-800 sm:border-0">
- <template v-if="runningMap[bot.id]">
- <button
- class="p-2 text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 rounded-lg transition-colors"
- :title="$t('bots.stop_bot')"
- @click="stopBot(bot.id)"
- >
- <MaterialDesignIcon icon-name="stop" class="size-5" />
- </button>
- <button
- class="p-2 text-blue-500 hover:bg-blue-50 dark:hover:bg-blue-900/20 rounded-lg transition-colors"
- :title="$t('bots.restart_bot')"
- @click="restartExisting(bot)"
- >
- <MaterialDesignIcon icon-name="refresh" class="size-5" />
- </button>
- </template>
- <template v-else>
- <button class="primary-chip px-3 py-1 text-xs" @click="startExisting(bot)">
- {{ $t("bots.start_bot") }}
- </button>
- </template>
+ <div
+ class="flex flex-wrap items-center gap-1.5 sm:gap-2 justify-end sm:shrink-0 pt-1 sm:pt-0 border-t border-gray-100 dark:border-zinc-800 sm:border-0"
+ >
+ <template v-if="runningMap[bot.id]">
<button
- class="p-2 text-gray-500 hover:bg-gray-50 dark:hover:bg-zinc-800 rounded-lg transition-colors"
- :title="$t('bots.export_identity')"
- @click="exportIdentity(bot.id)"
+ class="p-2 text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 rounded-lg transition-colors"
+ :title="$t('bots.stop_bot')"
+ @click="stopBot(bot.id)"
>
- <MaterialDesignIcon icon-name="export" class="size-5" />
+ <MaterialDesignIcon icon-name="stop" class="size-5" />
</button>
<button
- class="p-2 text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 rounded-lg transition-colors"
- :title="$t('bots.delete_bot')"
- @click="deleteBot(bot.id)"
+ class="p-2 text-blue-500 hover:bg-blue-50 dark:hover:bg-blue-900/20 rounded-lg transition-colors"
+ :title="$t('bots.restart_bot')"
+ @click="restartExisting(bot)"
>
- <MaterialDesignIcon icon-name="delete" class="size-5" />
+ <MaterialDesignIcon icon-name="refresh" class="size-5" />
+ </button>
+ </template>
+ <template v-else>
+ <button class="primary-chip px-3 py-1 text-xs" @click="startExisting(bot)">
+ {{ $t("bots.start_bot") }}
</button>
+ </template>
+ <button
+ class="p-2 text-gray-500 hover:bg-gray-50 dark:hover:bg-zinc-800 rounded-lg transition-colors"
+ :title="$t('bots.export_identity')"
+ @click="exportIdentity(bot.id)"
+ >
+ <MaterialDesignIcon icon-name="export" class="size-5" />
+ </button>
+ <button
+ class="p-2 text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 rounded-lg transition-colors"
+ :title="$t('bots.delete_bot')"
+ @click="deleteBot(bot.id)"
+ >
+ <MaterialDesignIcon icon-name="delete" class="size-5" />
+ </button>
</div>
</div>
</div>
@@ -168,10 +175,19 @@
</div>
<div class="flex flex-col-reverse sm:flex-row gap-2 sm:gap-3 sm:justify-end pt-2">
- <button type="button" class="secondary-chip px-6 py-2 w-full sm:w-auto" @click="selectedTemplate = null">
+ <button
+ type="button"
+ class="secondary-chip px-6 py-2 w-full sm:w-auto"
+ @click="selectedTemplate = null"
+ >
{{ $t("bots.cancel") }}
</button>
- <button type="button" class="primary-chip px-6 py-2 w-full sm:w-auto" :disabled="isStarting" @click="startBot">
+ <button
+ type="button"
+ class="primary-chip px-6 py-2 w-full sm:w-auto"
+ :disabled="isStarting"
+ @click="startBot"
+ >
<span
v-if="isStarting"
class="inline-block w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin mr-2"
diff --git a/meshchatx/src/frontend/components/tools/PaperMessagePage.vue b/meshchatx/src/frontend/components/tools/PaperMessagePage.vue
index 66097e6c..66b00a40 100644
--- a/meshchatx/src/frontend/components/tools/PaperMessagePage.vue
+++ b/meshchatx/src/frontend/components/tools/PaperMessagePage.vue
@@ -5,7 +5,9 @@
<!-- header -->
<div class="border-b border-gray-200 dark:border-zinc-800 pb-4">
<div class="flex items-start gap-3 min-w-0">
- <div class="p-2 bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-400 rounded-lg shrink-0">
+ <div
+ class="p-2 bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-400 rounded-lg shrink-0"
+ >
<MaterialDesignIcon icon-name="qrcode" class="size-6" />
</div>
<div class="min-w-0">
@@ -22,10 +24,19 @@
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4">
<!-- composer -->
<div class="space-y-4 min-w-0">
- <section class="rounded-lg border border-gray-200 dark:border-zinc-800 overflow-hidden bg-white dark:bg-zinc-950">
- <div class="px-4 py-3 border-b border-gray-200 dark:border-zinc-800 bg-gray-50/80 dark:bg-zinc-900/50">
- <h2 class="flex items-center gap-2 text-base font-semibold text-gray-900 dark:text-white">
- <MaterialDesignIcon icon-name="pencil-outline" class="size-5 text-gray-400 shrink-0" />
+ <section
+ class="rounded-lg border border-gray-200 dark:border-zinc-800 overflow-hidden bg-white dark:bg-zinc-950"
+ >
+ <div
+ class="px-4 py-3 border-b border-gray-200 dark:border-zinc-800 bg-gray-50/80 dark:bg-zinc-900/50"
+ >
+ <h2
+ class="flex items-center gap-2 text-base font-semibold text-gray-900 dark:text-white"
+ >
+ <MaterialDesignIcon
+ icon-name="pencil-outline"
+ class="size-5 text-gray-400 shrink-0"
+ />
Compose Message
</h2>
</div>
@@ -91,9 +102,15 @@
</section>
<!-- read / ingest section -->
- <section class="rounded-lg border border-gray-200 dark:border-zinc-800 overflow-hidden bg-white dark:bg-zinc-950">
- <div class="px-4 py-3 border-b border-gray-200 dark:border-zinc-800 bg-gray-50/80 dark:bg-zinc-900/50">
- <h2 class="flex items-center gap-2 text-base font-semibold text-gray-900 dark:text-white">
+ <section
+ class="rounded-lg border border-gray-200 dark:border-zinc-800 overflow-hidden bg-white dark:bg-zinc-950"
+ >
+ <div
+ class="px-4 py-3 border-b border-gray-200 dark:border-zinc-800 bg-gray-50/80 dark:bg-zinc-900/50"
+ >
+ <h2
+ class="flex items-center gap-2 text-base font-semibold text-gray-900 dark:text-white"
+ >
<MaterialDesignIcon icon-name="qrcode-scan" class="size-5 text-gray-400 shrink-0" />
Ingest Paper Message
</h2>
@@ -137,8 +154,12 @@
v-if="generatedUri"
class="rounded-lg border border-gray-200 dark:border-zinc-800 overflow-hidden bg-white dark:bg-zinc-950"
>
- <div class="px-4 py-3 border-b border-gray-200 dark:border-zinc-800 bg-blue-50/80 dark:bg-blue-900/20">
- <h2 class="text-base font-semibold text-blue-600 dark:text-blue-400">Generated QR Code</h2>
+ <div
+ class="px-4 py-3 border-b border-gray-200 dark:border-zinc-800 bg-blue-50/80 dark:bg-blue-900/20"
+ >
+ <h2 class="text-base font-semibold text-blue-600 dark:text-blue-400">
+ Generated QR Code
+ </h2>
</div>
<div class="px-4 py-4 sm:p-6 flex flex-col items-center text-gray-900 dark:text-gray-100">
<div class="p-3 bg-white rounded-2xl shadow-inner border border-gray-100 mb-6">
diff --git a/meshchatx/src/frontend/components/tools/RNPathPage.vue b/meshchatx/src/frontend/components/tools/RNPathPage.vue
index 84357e47..469840c5 100644
--- a/meshchatx/src/frontend/components/tools/RNPathPage.vue
+++ b/meshchatx/src/frontend/components/tools/RNPathPage.vue
@@ -6,7 +6,10 @@
>
<div class="flex items-center gap-2 sm:gap-3 min-w-0 flex-1">
<div class="p-2 bg-indigo-100 dark:bg-indigo-900/30 rounded-lg shrink-0">
- <MaterialDesignIcon icon-name="route" class="size-5 sm:size-6 text-indigo-600 dark:text-indigo-400" />
+ <MaterialDesignIcon
+ icon-name="route"
+ class="size-5 sm:size-6 text-indigo-600 dark:text-indigo-400"
+ />
</div>
<div class="min-w-0">
<h1 class="text-lg sm:text-xl font-bold text-gray-900 dark:text-white truncate">RNPath</h1>
@@ -264,7 +267,9 @@
<!-- manual actions -->
<div v-if="tab === 'actions'" class="max-w-2xl mx-auto space-y-6">
<!-- request path -->
- <section class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-4 sm:p-6 space-y-4">
+ <section
+ class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-4 sm:p-6 space-y-4"
+ >
<h2 class="text-lg font-bold">Request Path</h2>
<p class="text-sm text-gray-500">Broadcast a path request for a destination hash.</p>
<div class="flex flex-col sm:flex-row gap-2">
@@ -286,7 +291,9 @@
</section>
<!-- drop all via -->
- <section class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-4 sm:p-6 space-y-4">
+ <section
+ class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-4 sm:p-6 space-y-4"
+ >
<h2 class="text-lg font-bold">Drop All Via</h2>
<p class="text-sm text-gray-500">
Remove all known paths routed through a specific transport instance.
@@ -310,7 +317,9 @@
</section>
<!-- drop queues -->
- <section class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-4 sm:p-6 space-y-4">
+ <section
+ class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-4 sm:p-6 space-y-4"
+ >
<h2 class="text-lg font-bold">Drop Announce Queues</h2>
<p class="text-sm text-gray-500">
Clear all outbound announce packets currently queued on all interfaces.
diff --git a/meshchatx/src/frontend/components/tools/RNPathTracePage.vue b/meshchatx/src/frontend/components/tools/RNPathTracePage.vue
index 0332f770..b380308a 100644
--- a/meshchatx/src/frontend/components/tools/RNPathTracePage.vue
+++ b/meshchatx/src/frontend/components/tools/RNPathTracePage.vue
@@ -36,7 +36,9 @@
<div class="flex-1 overflow-y-auto">
<div class="p-3 sm:p-4 md:p-6 max-w-5xl mx-auto space-y-4 sm:space-y-6">
<!-- main input card -->
- <div class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-3 sm:p-4 md:p-6">
+ <div
+ class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-3 sm:p-4 md:p-6"
+ >
<div class="flex flex-col sm:flex-row items-stretch sm:items-center gap-3">
<div class="relative flex-1 min-w-0">
<input
@@ -109,7 +111,9 @@
class="space-y-6 animate-in fade-in slide-in-from-bottom-4 duration-500"
>
<!-- compact summary bar -->
- <div class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-1 overflow-hidden">
+ <div
+ class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-1 overflow-hidden"
+ >
<div class="flex flex-wrap items-center divide-x divide-gray-100 dark:divide-zinc-800">
<div class="flex-1 min-w-[120px] p-3 md:p-4 flex flex-col items-center text-center">
<div class="text-[10px] font-bold text-gray-400 uppercase tracking-widest mb-1">
@@ -145,7 +149,9 @@
</div>
<!-- path visualization -->
- <div class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-4 sm:p-6 md:p-10 lg:p-16">
+ <div
+ class="rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-4 sm:p-6 md:p-10 lg:p-16"
+ >
<!-- Desktop View (Horizontal) -->
<div class="hidden md:flex items-start justify-center min-w-fit py-4">
<template v-for="(node, idx) in traceResult.path" :key="'d-' + idx">
@@ -374,4 +380,3 @@ export default {
},
};
</script>
-
diff --git a/meshchatx/src/frontend/components/tools/RNodeFlasherPage.vue b/meshchatx/src/frontend/components/tools/RNodeFlasherPage.vue
index 28ed1bf8..46c611fe 100644
--- a/meshchatx/src/frontend/components/tools/RNodeFlasherPage.vue
+++ b/meshchatx/src/frontend/components/tools/RNodeFlasherPage.vue
@@ -40,7 +40,9 @@
<!-- content -->
<div class="flex-1 min-h-0 overflow-y-auto p-3 sm:p-6 space-y-4 sm:space-y-6">
<!-- setup card: Select device & Firmware -->
- <div class="border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 rounded-lg overflow-hidden">
+ <div
+ class="border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 rounded-lg overflow-hidden"
+ >
<div class="grid grid-cols-1 md:grid-cols-2">
<!-- Left: Device Selection -->
<div class="p-6 border-b md:border-b-0 md:border-r border-gray-100 dark:border-zinc-800 space-y-4">
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────